<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
  <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"/>
  <title>销售中心-预定</title>
  <link rel="stylesheet" href="../../css/bootstrap.font.min.css"/>
  <link rel="stylesheet" href="../../css/forms.min.css"/>
  <link rel="stylesheet" href="../../css/style.css"/>
</head>
<body ng-controller="appCtrl">
<nav class="navbar navbar-inverse navbar-fixed-top to-nav">
  <div class="container-fluid">
    <div class="navbar-header">
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span>
      </button>
      <a class="navbar-brand to-brand" href="#"><i class="fa fa-weixin fa-fw"></i>&nbsp;&nbsp;SZG 后台管理系统</a>
    </div>
    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
      <ul class="nav navbar-nav navbar-right">
        <li class="dropdown">
          <a href="javascript:" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
            <i class="fa fa-gear"></i>&nbsp;Mr Toma&nbsp;<span class="caret"></span>
          </a>
          <ul class="dropdown-menu">
            <li><a href="#">个人信息</a></li>
            <li><a href="#">修改密码</a></li>
            <li role="separator" class="divider"></li>
            <li><a href="#">退出系统</a></li>
          </ul>
        </li>
      </ul>
    </div><!-- navbar-collapse -->
  </div>
</nav>
<!-- 菜单 start -->
<aside class="sidebar_left">
  <div class="sidebar_content">
    <ul class="nav">
      <li class="active">
        <a href="#" class="nav-link"><i class="fa fa-group"></i>销售中心</a>
        <ul class="link-lop">
          <li><a href="javascript:">旅游产品</a></li>
          <li><a href="javascript:">酒店产品</a></li>
          <li><a href="javascript:">玩乐产品</a></li>
        </ul>
      </li>
      <li><a href="#" class="nav-link"><i class="fa fa-wrench"></i>网站设置</a></li>
    </ul>
  </div>
</aside>
<!-- 菜单 end -->
<section class="content">
  <div class="con-wap">
    <!-- view start -->

    <ol class="breadcrumb border">
      <li><a href="#">销售中心</a></li>
      <li><a href="#">旅游产品查询</a></li>
      <li><a href="#">旅游产品详情</a></li>
      <li class="active">立即预定</li>
    </ol>

    <section class="w100b reser-topprompt mb20">
      <div class="reser-tpt-i active">
        <p>提交订单</p>
        <span>1</span>
      </div>
      <div class="reser-tpt-i">
        <p>完善游客信息</p>
        <span>2</span>
      </div>
      <div class="reser-tpt-i">
        <p>付款</p>
        <span>3</span>
      </div>
      <div class="reser-tpt-i">
        <p>交易成功</p>
        <span>4</span>
      </div>
      <div class="reser-tpt-i">
        <p>签订合同</p>
        <span>5</span>
      </div>
    </section>

    <section class="row">
      <aside class="col-md-3">
        <!-- 费用明细 -->
        <ul class="list-group reser-mingxi">
          <li class="list-group-item active">
            <h4>费用明细</h4>
          </li>
          <li class="list-group-item">
            <h4 class="mb20 text-theme">团费</h4>
            <p>成人：￥{{data.cr.d}}*{{data.cr.n}} <span class="pull-right">￥{{form.cr}}</span></p>
            <p>儿童：￥{{data.et.d}}*{{data.et.n}} <span class="pull-right">￥{{form.et}}</span></p>
            <p class="text-right text-danger reser-mx-m" ng-bind="form.tf | currency:'￥'"></p>
          </li>
          <li class="list-group-item">
            <h4 class="mb20 text-theme">附加费</h4>
            <p>单房差：￥{{data.fj.d}}*{{data.fj.n}}<span class="pull-right">￥{{form.fj}}</span></p>
            <p class="text-right text-danger reser-mx-m" ng-bind="form.fj | currency:'￥'"></p>
          </li>
          <li class="list-group-item">
            <h4 class="mb20 text-theme">保险</h4>
            <p><span class="pull-right">￥{{form.bx}}</span> {{form.selbx.n}}：￥{{form.selbx.p}}*{{form.nop}} </p>
            <p class="text-right text-danger reser-mx-m" ng-bind="form.bx | currency:'￥'"></p>
          </li>
          <li class="list-group-item">
            <h4 class="mb20 text-theme">优惠</h4>
            <p>成人：￥{{form.yh.cr}}</p>
            <p>儿童：￥{{form.yh.et}}</p>
            <p class="text-right text-danger reser-mx-m" ng-bind="form.yh.zg | currency:'￥'"></p>
          </li>
          <li class="list-group-item">
            <h3>订单总额</h3>
            <p class="text-danger text-right fz20"> <strong ng-bind="form.total | currency:'￥'"></strong></p>
          </li>
        </ul>

      </aside>
      <article class="col-md-9">
        <!-- 产品基本信息 -->
        <div class="panel panel-default">
          <header class="panel-heading">
            <h4>产品基本信息</h4>
          </header>
          <article class="panel-body">
            <p class="xinxi-tit no-m">
              <span>供应商：东方国旅</span>
              <span>联系人：多多</span>
              <span>手机号：1321521421</span>
              <span>QQ：705641415</span>
              <a href="sales_detail.html">立即咨询</a>
            </p>
          </article>

          <table class="table table-bordered table-reserv">
            <thead>
            <tr>
              <th>产品编号</th>
              <th>出发地</th>
              <th>产品名称</th>
              <th>出团日期</th>
              <th>行程天数</th>
            </tr>
            </thead>
            <tbody>
            <tr>
              <td>ct12314345</td>
              <td>北京</td>
              <td>sd的看；看了； 看个死法了可观的公里数，收到了罚款个 ；上课发google.cn(*^__^*)(*^__^*)</td>
              <td nowrap>2016-03-06</td>
              <td>30天</td>
            </tr>
            </tbody>
          </table>
        </div>
        <!-- 费用明细 -->
        <div class="panel panel-default">
          <header class="panel-heading">
            <h4>费用明细</h4>
          </header>
          <article class="panel-body">
            <h4 class="no-m">基本团费</h4>
          </article>
          <table class="table table-bordered table-reserv">
            <thead>
            <tr>
              <th>类型</th>
              <th>价格</th>
              <th>数量</th>
              <th>总计</th>
            </tr>
            </thead>
            <tbody>
            <tr>
              <td>成人</td>
              <td>￥{{data.cr.d}}/人</td>
              <td nowrap class="reserv-count j_count" data-saletype="cr">
                <button class="btn btn-default j_sub fa fa-minus" type="button"></button>
                <input class="reser-num" type="number" data-min="1" ng-model="data.cr.n">
                <button class="btn btn-default j_add fa fa-plus" type="button"></button>
              </td>
              <td rowspan="2" class="text-theme" id="totalprice" ng-bind="form.tf | currency:'￥'"></td>
            </tr>
            <tr>
              <td>儿童</td>
              <td>￥{{data.et.d}}/人</td>
              <td nowrap class="reserv-count j_count" data-saletype="et">
                <button class="btn btn-default j_sub fa fa-minus" type="button"></button>
                <input class="reser-num" type="number" data-min="0" ng-model="data.et.n">
                <button class="btn btn-default j_add fa fa-plus" type="button"></button>
              </td>
            </tr>
            </tbody>
          </table>

          <article class="panel-body">
            <h4 class="no-m">附加费</h4>
          </article>
          <table class="table table-bordered table-reserv">
            <thead>
            <tr>
              <th>类型</th>
              <th>价格</th>
              <th>数量</th>
              <th>总计</th>
            </tr>
            </thead>
            <tbody>
            <tr>
              <td>单房差</td>
              <td>￥{{data.fj.d}}/间</td>
              <td nowrap class="reserv-count j_count" data-saletype="fj">
                <button class="btn btn-default j_sub fa fa-minus" type="button"></button>
                <input class="reser-num" type="number" data-min="0" ng-model="data.fj.n">
                <button class="btn btn-default j_add fa fa-plus" type="button"></button>
              </td>
              <td class="text-theme" ng-bind="form.fj | currency:'￥'"></td>
            </tr>
            </tbody>
          </table>

          <article class="panel-body">
            <h4 class="no-m">保险费</h4>
          </article>
          <table class="table table-bordered table-reserv">
            <thead>
            <tr>
              <th>名称</th>
              <th>价格</th>
              <th>数量</th>
              <th>总计</th>
            </tr>
            </thead>
            <tbody>

            <tr ng-repeat="d in data.bx">
              <td class="text-left">
                <label>
                  <input type="radio" name="baoxian" value="{{d.val}}" ng-model="data.bxsel"> {{d.name}}
                </label>
              </td>
              <td>￥{{d.price}}/人</td>
              <td>{{form.nop}}</td>
              <td rowspan="3" class="text-theme" ng-if="$index == 0" ng-bind="form.bx | currency:'￥'"></td>
            </tr>

            </tbody>
          </table>

          <article class="panel-body p20">
            <h4 class="mb20">联系人信息：</h4>
            <div class="displayt w100b mb15">
              <div class="cell w160 inline text-right"> 合同旅游代表名称：</div>
              <div class="cell">
                <input type="text" class="form-control" placeholder="合同旅游代表名称" required>
              </div>
            </div>
            <div class="displayt w100b mb15">
              <div class="cell w160 inline text-right"> 签订合同手机号：</div>
              <div class="cell">
                <input type="text" class="form-control" placeholder="签订合同手机号" required>
              </div>
            </div>
            <div class="displayt w100b ">
              <div class="cell w160 inline text-right"> 邮箱：</div>
              <div class="cell">
                <input type="text" class="form-control" placeholder="邮箱">
              </div>
            </div>
          </article>

          <footer class="panel-footer text-right">
            <button type="button" class="btn btn-default btn-lg w120">返回</button>
            <button type="button" class="btn btn-warning btn-lg w120">保存</button>
          </footer>
        </div>

      </article>
    </section>

    <div class="h360"></div>
    <!-- view end -->
  </div>
</section>


<script src="../../lib/angular.min.js"></script>
<script src="../../lib/jquery.min.js"></script>
<script src="../../js/sea.js"></script>
<script src="../../js/main.js"></script>
<script>
  window.data = {
    id:'dt12310401',
    cr:{
      d:2000,
      n:2
    },
    et:{
      d:1000,
      n:0
    },
    fj:{
      d:200,
      n:1
    },
    bxsel:1,
    bx:[
      { name:'平安境外旅游意外险(除日本)1-4日', price:35, val:1},
      { name:'平安境外旅游意外险(除太平洋)1-4日', price:25, val:2},
      { name:'平安境外旅游意外险(新西兰)1-4日', price:85, val:3}
    ],
    yh:{
      cr:0.85,
      et:0.9
    }
  }

  seajs.use('sales',function (cc) {
    cc.salesReser1();
  });
</script>
</body>
</html>